<template>
  <el-dialog
    title="订单详情"
    v-model="dialogVisible"
    width="30%"
    :before-close="handleClose"
    style="color: white; background-color: #000000a2"
  >
    <h1 style="color: white">订单详情</h1>
    <h2 style="color: white; text-align: left">
      订单号:{{ order.orderFormId }}
    </h2>
<h2 style="color: white; text-align: left">订单书籍：{{ bookname }}</h2>

    <h2 style="color: white; text-align: left">用户账号：{{ order.userId }}</h2>
    <h2 style="color: white; text-align: left">
      订单书籍数量：{{ order.totalNum }}
    </h2>
    <h2 style="color: white; text-align: left">
      订单书籍总价格：{{ order.totalMoney }}
    </h2>
 
    <h2 style="color: white; text-align: left">订单状态：{{ order.state }}</h2>
       <h2 style="color: white; text-align: left">
      购买时间：{{ order.orderDate }}
    </h2>
    <span class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogVisible = false" style="background-color: #000000a2;border: 0ch;">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: "Orderdetail",
  data() {
    return {
      dialogVisible: false,
        order: {},
      bookname:''
    };
    },
    methods: {
        getbookname() {
            var data = new FormData();
            data.append('bookId', this.order.bookId)
            this.$axios.post("/getbookname", data).then(resp => {
                console.log(resp.data);
                this.bookname=resp.data
            })
    }
    },
   
};
</script>